<p>Custom dropdown panel option template using <b>ng-option-tmp</b></p>

<ng-select [items]="cities" [(ngModel)]="selectedCity" bindLabel="name" bindValue="name">
	<ng-template ng-option-tmp let-item="item" let-index="index" let-search="searchTerm">
		@if (item.name === 'Kaunas') {
			<div>{{ item.name }}</div>
		}
		@if (item.name !== 'Kaunas') {
			<div style="margin: 10px 0" class="card">
				<div class="card-body">
					<h5 class="card-title" [ngOptionHighlight]="search">{{ item.name }}</h5>
					<h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>
					<p class="card-text">
						<img height="15" width="15" [src]="item.avatar" />
						Some quick example text to build
					</p>
					@if (item.name === 'Pavilnys') {
						<div>
							<a href="#" class="card-link">Card link</a>
							<a href="#" class="card-link">Another link</a>
						</div>
					}
				</div>
			</div>
		}
	</ng-template>
</ng-select>
